import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:logger/logger.dart';
import 'package:lovify/core/constants/config.dart';
import 'package:lovify/models/user.dart';
import 'package:lovify/routes/app.dart';
import 'package:lovify/state/user_controller.dart';
import 'package:lovify/widgets/aq_avatar.dart';
import 'package:lovify/widgets/aq_body.dart';
import 'package:lovify/widgets/aq_text.dart';

class MyTab extends StatefulWidget {
  const MyTab({super.key});

  @override
  State<MyTab> createState() => _MyTabState();
}

class _MyTabState extends State<MyTab> {
  final Logger _logger = Logger(printer: PrettyPrinter());
  final _userState = Get.find<UserController>();
  String? _selectedTheme;

  @override
  void initState() {
    super.initState();
    _selectedTheme = "赤焰明珠";
  }

  @override
  Widget build(BuildContext context) {
    User u = _userState.user.value;
    final List<Map<String, dynamic>> items = [
      {"name": "赤焰明珠", "hex": "#FF5D5B"},
      {"name": "碧海蓝天", "hex": "#3487FF"},
      {"name": "翡翠之森", "hex": "#32DB98"}
    ];

    return AQBody(
      body: Padding(
        padding: const EdgeInsets.only(top: 24.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                AqAvatar(
                  radius: 40,
                  imageUrl: previewUrl + (u.avatar as String),
                ),
                const SizedBox(width: 16),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        AQText(
                          content: (u.name as String),
                          fontSize: 26,
                        ),
                        const SizedBox(width: 12),
                        GestureDetector(
                            onTap: () {
                              Navigator.pushNamed(context, AppRoutes.edit);
                            },
                            child: Transform.translate(
                              offset: const Offset(0, 2),
                              child: const Icon(
                                Icons.edit_square,
                                size: 24,
                              ),
                            ),
                          )
                      ],
                    ),
                    const SizedBox(height: 4),
                    const AQText(
                      content: "暂无关系",
                      fontSize: 14,
                      color: Color(0xFF6B7280),
                    ),
                  ],
                ),
              ],
            ),
            const SizedBox(height: 20),
            Row(
              children: [
                Container(
                  width: 5,
                  height: 30,
                  decoration: BoxDecoration(
                    color: const Color(0xFFFF5D5B),
                    borderRadius: BorderRadius.circular(5),
                  ),
                ),
                const SizedBox(width: 12),
                const AQText(
                  content: "选择主题",
                  fontSize: 24,
                  color: Color(0xFF333333),
                ),
              ],
            ),
            const SizedBox(height: 24),
            Expanded(
              child: ListView.builder(
                shrinkWrap: true,
                itemCount: items.length,
                itemBuilder: (context, index) {
                  final theme = items[index];
                  return Card(
                    margin: const EdgeInsets.symmetric(vertical: 8),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(4),
                    ),
                    elevation: 4,
                    color: Color(int.parse("0xFF${theme["hex"].substring(1)}")),
                    child: ListTile(
                      contentPadding: const EdgeInsets.symmetric(vertical: 16, horizontal: 20),
                      title: Row(
                        children: [
                          Text(
                            theme["name"],
                            style: const TextStyle(
                              color: Colors.white,
                              fontWeight: FontWeight.bold,
                              fontSize: 18,
                            ),
                          ),
                          const Spacer(),
                          if (_selectedTheme == theme["name"])
                            const Icon(Icons.check, color: Colors.white, size: 20),
                        ],
                      ),
                      onTap: () {
                        setState(() {
                          _selectedTheme = theme["name"];
                        });
                        _logger.i('主题选择: ${theme["name"]}');
                      },
                    ),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}
